<template>
  <a-spin :spinning="showLoading"  tip="请求中" size="large">
    <a-card>
      <div class="flex">
        <a-upload :showUploadList="false" action="https://jic.jnby.com/activity/market-act/common/upload/multipart" @change="handleChange">
          <a-button><a-icon type="upload" /> 导入订单 </a-button>
        </a-upload>
        <a-button style="margin-left:20px" type="primary" @click="cteateHandle">创建订单</a-button>
      </div>

      <a-table
        bordered
        :columns="columns"
        :rowKey="record => record.sourceCode"
        :data-source="dataSource"
        :pagination="pagination"
        :scroll="{ x: true }"
        @change="handleTableChange"
      >
      <template slot="zd" slot-scope="txt,record">{{record.ebOrder?'已制单':'未制单'}}</template>
      </a-table>
    </a-card>
  </a-spin>
</template>

<script>
import { create, queryResult, queryList,importFile } from '@/api/micromall/box.js'
import { postAction } from '@/api/manage'
import { listMixin } from '../util/listMixin'
const columns = [
  {
    title: '订单号',
    width: 120,
    dataIndex: 'sourceCode',
    align: 'center'
    // scopedSlots: { customRender: 'customImage' }
  },
  {
    title: '会员卡号',
    width: 120,
    dataIndex: 'cardNo',
    align: 'center'
    // scopedSlots: { customRender: 'customImage' }
  },
  {
    title: '姓名',
    width: 100,
    dataIndex: 'receiverName'
  },
  {
    title: '手机号',
    width: 150,
    dataIndex: 'receiverMobile'
  },
  {
    title: '商品sku',
    width: 100,
    dataIndex: 'sku'
  },
  {
    title: '省',
    width: 100,
    dataIndex: 'provinceName'
  },
  {
    title: '市',
    width: 100,
    dataIndex: 'cityName'
  },
  {
    title: '区/县',
    width: 100,
    dataIndex: 'districtName'
  },
  {
    title: '详细地址',
    width: 100,
    dataIndex: 'receiverAddress'
  },
  {
    title: '创建时间',
    width: 100,
    dataIndex: 'insertDate'
  },
  {
    title: 'EB单号',
    width: 100,
    dataIndex: 'ebOrder'
  },
  {
    title: '是否制单',
    width: 100,
    scopedSlots: { customRender: 'zd' }
  }
]
export default {
  mixins: [listMixin],
  data() {
    return {
      columns,
      url: {
        list: '/jic-backend-operation/operate/order/box/list'
        // delete: '/jic-backend-wechat/wechat-client/template/config'
      },
      timer: null,
      showLoading: false
    }
  },
  methods: {
    async importFile(fileName){
      const res = await importFile(fileName)
      if(res.code == 200){
        this.timer = setInterval(this.getResult, 1000, res.data)
      }else{
        this.$message.error(res.msg)
        this.showLoading = false
      }
    },
    loadData(arg) {
      if (!this.url.list) {
        this.$message.error('请设置url.list属性!')
        return
      }
      //加载数据 若传入参数1则加载第一页的内容
      if (arg === 1) {
        this.pagination.current = 1
      }
      this.showLoading = true
      var params = this.getQueryParams() //查询条件
      console.log(params)
      postAction(`${this.url.list}?current=${params.current}&size=${params.size}`, params).then(res => {
        if (res.code == 200) {
          this.timer = setInterval(this.getList,1000,res.data)
          //update-end---author:wsp    Date:20210826
        } else {
          this.$message.warning(res.msg)
        }
        this.loading = false
      })
    },
    handleChange({ file }) {
      this.showLoading = true
      if (file.status === 'error') {
        this.showLoading = false
        this.$message.error(file.response.msg)
      } else if (file.status === 'done') {
        console.log(file.response.data)
        this.importFile(file.response.data)
      }
    },
    async getResult(key) {
      console.log(key)
      const result = await queryResult({ key })
      if (result.data !== 'wait') {
        this.showLoading = false
        clearInterval(this.timer)
        this.timer = null
        this.$message.info(result.data)
        if (result.data === 'success') {
          this.loadData()
        }
      }
    },
    async getList(key) {
      const res = await queryResult({ key })
      if (res.data !== 'wait') {
        this.showLoading = false
        clearInterval(this.timer)
        this.timer = null
        res.data = JSON.parse(res.data)
        this.dataSource = res.data.records || res.data
          if (res.data.total) {
            this.pagination.total = res.data.total
          } else {
            this.pagination.total = 0
          }
      }
    },
    cteateHandle() {
      this.showLoading = true
      create().then(res => {
        if (res.code == 200) {
          this.timer = setInterval(this.getResult, 2000, res.data)
        } else {
          this.showLoading = false
          this.$message.error(res.msg)
        }
      })
    }
  }
}
</script>

<style>
.flex {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background-color: #fff;
  padding: 30px;
  border-radius: 4px;
}
</style>
